<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <title>班车线路-江城巴士</title>
    <meta name="description" content="">
    <meta name="author" content="">
    <link rel="icon" href="favicon.ico">
    
    <link rel="stylesheet" href="css/app.css">
</head>

<body>

<header>
    <div class="title">班车线路</div>
</header>

<section class="wrap route-box">
    <form action="">
        <div class="search">
            <div class="item from">
                <em>从</em>
                <input type="text" class="ipt" name="" id="from" placeholder="从哪儿出发？" required />
                <i class="clear"></i>
            </div>
            <div class="item to">
                <em>到</em>
                <input type="text" class="ipt" name="" id="to" placeholder="到哪儿去？" required />
                <i class="clear"></i>
            </div>
            <div class="button">
                <button type="submit" class="ubtn ubtn-blue" id="submit">查询班车</button>
            </div>
        </div>
    </form>

    <div class="ui-list">
        <div class="hd">全部线路</div>
        <div class="bd">
            <ul>
                <li class="c4">
                    <div class="inner">
                        <div class="fromto">
                            <em>光谷广场</em>
                            <i></i>
                            <em>武昌火车站</em>
                        </div>
                        <div class="detail">
                            <span>东风风行cm7</span>
                            <span>即将出发：9:30</span>
                            <span>车牌：鄂TF0809</span>
                            <span>预定人数：48</span>
                        </div>
                        <div class="bus">野芷湖西路保利心语</div>
                        <div class="op">
                            <a href="#1" class="seat">预定座位</a>
                        </div>
                        <div class="fav">
                            <a href="javascript:;"></a>
                        </div>
                    </div>
                </li>
                <li class="c4">
                    <div class="inner">
                        <div class="fromto">
                            <em>光谷广场</em>
                            <i></i>
                            <em>武昌火车站</em>
                        </div>
                        <div class="detail">
                            <span>东风风行cm7</span>
                            <span>即将出发：9:30</span>
                            <span>车牌：鄂TF0809</span>
                            <span>预定人数：48</span>
                        </div>
                        <div class="bus">野芷湖西路保利心语</div>
                        <div class="op">
                            <a href="#1" class="seat">预定座位</a>
                        </div>
                        <div class="fav faved">
                            <a href="javascript:;"></a>
                        </div>
                    </div>
                </li>
            </ul>
        </div>
    </div>
</section>


<script src="js/zepto.min.js"></script>
<script>
    $(function() {
        // 清空输入框文本
        $('.clear').on('click', function() {
            $(this).prev().val('');
        });
    })
</script>

</body>
</html>